﻿<%
        request.setAttribute("path", request.getContextPath());
%>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户中心-青鸟会员服务</title>
    <link rel="icon" href="${path}/jbs/images/ico.ico" type="image/x-icon">

    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

    <link rel="stylesheet" href="${path}/assets/font/iconsmind-s/css/iconsminds.css" />
    <link rel="stylesheet" href="${path}/assets/font/simple-line-icons/css/simple-line-icons.css" />

    <link rel="stylesheet" href="${path}/assets/css/vendor/bootstrap.min.css" />
    <link rel="stylesheet" href="${path}/assets/css/vendor/bootstrap.rtl.only.min.css" />
    <link rel="stylesheet" href="${path}/assets/css/vendor/component-custom-switch.min.css" />
    <link rel="stylesheet" href="${path}/assets/css/vendor/perfect-scrollbar.css" />

    <link rel="stylesheet" href="${path}/assets/css/main.css" />
</head>

<body id="app-container" class="menu-default show-spinner">
    <nav class="navbar fixed-top">
        <a class="navbar-logo" href="${path}/Index">
            <img src="${path}/assets/img/logo/logoWhiteText.png" alt="" style="margin-left: 20px">
        </a>
        <div class="search" data-search-path="Pages.Search.html?q=">
            <input placeholder="搜索商品...">
            <span class="search-icon">
                    <i class="simple-icon-magnifier"></i>
                </span>
        </div>
        <div class="navbar-right">
            <button class="btn1 rounded-btn">青鸟优选首页</button>
            <button class="btn1 rounded-btn">购物车</button>
            <button class="btn1 rounded-btn">商品分类</button>
            <div class="user d-inline-block">
                <button class="btn btn-empty p-0" type="button" data-toggle="dropdown" aria-haspopup="true"
                    aria-expanded="false">
                    <span class="name">${requestScope.user.loginname}</span>
                    <span>
                        <img alt="Profile Picture" src="${requestScope.user.pic_link}" style="height: 50px;width: 50px" />
                    </span>
                </button>
            </div>
        </div>
    </nav>

    <div class="menu">
        <div class="main-menu">
            <div class="scroll">
                <ul class="list-unstyled">
                    <li class="active">
                        <a href="${path}/User">
                            <i class="iconsminds-crown-2"></i>
                            <span>会员首页</span>
                        </a>
                    </li>
                    <li>
                        <a href="${path}/Orders">
                            <i class="iconsminds-digital-drawing"></i> 历史订单
                        </a>
                    </li>
                    <li>
                        <a href="#layouts">
                            <i class="iconsminds-heart"></i>我的收藏
                        </a>
                    </li>
                    <li>
                    <a href="#layouts">
                        <i class="iconsminds-address-book-2"></i>地址管理
                    </a>
                </li>
                    <li>
                        <a href="#layouts">
                            <i class="iconsminds-security-settings"></i>账户安全
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </div>

    <main>
        <div class="container-fluid">
            <div class="row">
                <div class="col-12">
                    <h1>会员信息</h1>
                    <div class="separator mb-5"></div>
                    </div>
            </div>
            <div class="row userInfoRow" style="margin-left:3.5%">
                    <div class="card" style="width: 30%">
                        <div class="card-body" style="margin-top:1.5rem">
                            <div class="text-center rounded-circle">
                                <div class="ProfilePicDiv" style="background-image: url('${requestScope.user.pic_link}');">
                                    <a href=""><span>更换头像</span></a>
                                </div>
                                <p class="list-item-heading mb-1" style="font-size:25px">${requestScope.user.loginname}</p>
                                <p class="mb-4 text-muted text-small" >uid:${requestScope.user.id}</p>
                                <a href="${path}/logoutServlet"><button type="button" class="btn btn-sm btn-outline-primary ">退出登录</button></a>
                            </div>
                        </div>
                    </div>
                    <div class="card" style="width: 60%;margin-left:3%">
                        <div class="card-body" style="display: flex">
                            <ul class="sortable list-unstyled userInfo">
                                <li>
                                    <p>用户名：${requestScope.user.loginname}</p>
                                </li>
                                <li>
                                    <p>绑定手机：${requestScope.user.phone} </p>
                                </li>
                                <li>
                                    <p>绑定邮箱：${requestScope.user.email}</p>
                                </li>
                                <li>
                                    <p>用户等级：${requestScope.user.userTypeText}</p>
                                </li>
                            </ul>
                            <ul class="sortable list-unstyled userInfoBtn">
                                <li>
                                    <button class="btn-outline-primary rounded-btn">修改</button>
                                </li>
                                <li>
                                    <a href="${path}/UpdatePhone"><button class="btn-outline-primary rounded-btn">更换</button></a>
                                </li>
                                <li>
                                    <button class="btn-outline-primary rounded-btn">更换</button>
                                </li>
                                <li>
                                    <button class="btn-outline-primary rounded-btn">查看</button>
                                </li>
                            </ul>
                        </div>
                    </div sty>
        </div>
            <div class="row">
                <div class="col-12 mt-5">
                    <h1>订单信息</h1>
                    <div class="separator mb-5"></div>

                </div>
            </div>
            <div class="row icon-cards-row mb-4">
                <div class="col-md-3 col-lg-2 col-sm-4 col-6 mb-4">
                    <a href="#" class="card">
                        <div class="card-body text-center">
                            <i class="simple-icon-handbag"></i>
                            <p class="card-text font-weight-semibold mb-0">所有订单</p>
                            <p class="lead text-center">XXX</p>
                        </div>
                    </a>
                </div>
                <div class="col-md-3 col-lg-2 col-sm-4 col-6 mb-4">
                    <a href="#" class="card">
                        <div class="card-body text-center">
                            <i class="simple-icon-equalizer"></i>
                            <p class="card-text font-weight-semibold mb-0">待发货</p>
                            <p class="lead text-center">XXX</p>
                        </div>
                    </a>
                </div>
                <div class="col-md-3 col-lg-2 col-sm-4 col-6 mb-4">
                    <a href="#" class="card">
                        <div class="card-body text-center">
                            <i class="simple-icon-plane"></i>
                            <p class="card-text font-weight-semibold mb-0">运送中</p>
                            <p class="lead text-center">xxx</p>
                        </div>
                    </a>
                </div>
                <div class="col-md-3 col-lg-2 col-sm-4 col-6 mb-4">
                    <a href="#" class="card">
                        <div class="card-body text-center">
                            <i class="simple-icon-check"></i>
                            <p class="card-text font-weight-semibold mb-0">已签收</p>
                            <p class="lead text-center">XXX</p>
                        </div>
                    </a>
                </div>
            </div>
    </main>

    <footer class="page-footer">
        <div class="footer-content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-12 col-sm-6">
                        <p class="mb-0 text-muted">Copyright &copy 2006-2020 武汉北启至优文化科技有限公司 版权所有 All Rights Reserved.</p>
                    </div>
                    <div class="col-sm-6 d-none d-sm-block">
                        <img class="float-right" src="${path}/assets/img/images/payment_card.png">
                    </div>
                </div>
            </div>
        </div>
    </footer>


    <script src="${path}/assets/js/vendor/jquery-3.3.1.min.js"></script>
    <script src="${path}/assets/js/vendor/bootstrap.bundle.min.js"></script>
    <script src="${path}/assets/js/vendor/perfect-scrollbar.min.js"></script>
    <script src="${path}/assets/js/vendor/mousetrap.min.js"></script>
    <script src="${path}/assets/js/dore.script.js"></script>
    <script src="${path}/assets/js/scripts.js"></script>
</body>

</html>